import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';

import 'routes.dart';

const TAG = 'SHRINE';

class HeroPage2 extends StatefulWidget {
  @override
  _HeroPage2State createState() => _HeroPage2State();
}

class _HeroPage2State extends State<HeroPage2> {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _setData();
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        centerTitle: true,
        title: Text(
          TAG,
          style: TextStyle(
            fontSize: 17,
            color: Colors.black,
          ),
        ),
      ),
      body: Padding(
        padding: EdgeInsets.all(10),
        child: _grideView(2, 1 / 1),
      ),
    );
  }

  _grideView(int i, var d) {
    return GridView.count(
      //横轴数量
      crossAxisCount: i,
      shrinkWrap: true,
      childAspectRatio: d,
      mainAxisSpacing: 2,
      crossAxisSpacing: 2,
      children: _setData(),
    );
  }

  _setData() {
    List<Widget> datas = new List();
    for (int i = 0; i < 4; i++) {
      datas.add(Container(
        width: 160,
        height: 200,
        child: Hero(
            tag: 'hero$i',
            child: new Material(
              color: Colors.transparent,
              child: new InkWell(
                onTap: () {
                  String route = '${Routes.heroNew}?tag=hero$i';
                  Routes.router.navigateTo(context, route,
                      replace: false, transition: TransitionType.fadeIn);
                },
                child: Card(
                  color: Colors.white,
                  elevation: 5,
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(3))),
                  child: Padding(
                    padding: EdgeInsets.fromLTRB(25, 15, 25, 25),
                    child: Column(
                      children: <Widget>[
                        Text(
                          '29',
                          style: TextStyle(fontSize: 22, color: Colors.black),
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Image.asset(
                          'images/icon.png',
                          height: 60,
                          width: 60,
                          fit: BoxFit.fill,
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            )),
      ));
    }
    return datas;
  }
}
